<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>已处理申请列表</title>
    <script src="/jquery/jquery-3.2.1.min.js"></script>
    <script src="/layui/layui.js"></script>
    <link rel="stylesheet" href="/layui/css/layui.css"/>
    <link rel="stylesheet" href="/css/usermodule/user-list.css"/>
    <style>
        .default{
            background-color: #009688;
        }
    </style>
</head>
<body>
    <div class="layui-row">
        <div class="layui-col-md11">
            <div class="layui-card headerCenter">
                <div class="layui-card-header backColor">
                    已处理申请列表
                    <div class="btnRight" style="margin-bottom: 10px">
                        <button onclick="refresh()" type="button" class="layui-btn layui-btn layui-btn-sm">
                            <i class="layui-icon layui-icon-refresh-1"></i>
                            刷新
                        </button>
                        <button onclick="backOff()" type="button" class="layui-btn layui-btn layui-btn-sm">
                            <i class="layui-icon layui-icon-return"></i>
                            返回
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div class="layui-col-md11  headerCenter btnLeft" id="btn">
            <button class="default layui-btn layui-btn-sm  layui-btn-primary">
                已通过
            </button>
            <button class="layui-btn layui-btn-sm  layui-btn-primary">
                已驳回
            </button>
        </div>
    </div>
    <!--筛选查询-->
    <div class="layui-row">
        <div class="layui-col-md11">
            <div class="layui-card headerCenter">
                <div class="layui-card-header backColor">
                    <i class="layui-icon">&#xe615;</i>
                    筛选查询
                    <button onclick="accurate()" class="btnRight layui-btn layui-btn-sm">
                        高级检索
                    </button>
                </div>
                <div class="layui-card-body">
                    <form class="layui-form" id="myFrom">
                        <div class="layui-form-item">
                            <div class="floa">
                                <label class="layui-form-label fontsize" >申请时间：</label>
                                <div class="layui-input-inline" style="margin-right: -30px; padding-right: -30px">
                                    <input type="text" id="test1" name="applyDate" required lay-verify="required" placeholder="申请时间" autocomplete="off" class="layui-input inp">
                                </div>
                            </div>
                            <div class="floa">
                                <label class="layui-form-label fontsize">申请账号：</label>
                                <div class="layui-input-inline fontsize inp">
                                    <input type="text" name="account" required lay-verify="required" placeholder="申请账号" autocomplete="off" class="layui-input inp">
                                </div>
                            </div>

                            <label class="layui-form-label fontsize">申请人姓名：</label>
                            <div class="layui-input-inline">
                                <input type="text" name="nickname" required lay-verify="required" placeholder="申请人姓名" autocomplete="off" class="layui-input inp">
                            </div>

                            <span style="float:right;">
                                    <button onclick="selProduct()" type="button" class="layui-btn layui-btn layui-btn-sm">
                                        <i class="layui-icon layui-icon-search"></i> 搜索
                                    </button>
                                    <button onclick="refresh()" type="button" class="layui-btn layui-btn-warm layui-btn layui-btn-sm">
                                        <i class="layui-icon layui-icon-refresh-1"></i> 重置
                                    </button>
                                </span>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div class="layui-col-md11">
            <div class="layui-card headerCenter">
                <div class="layui-card-header backColor">
                    <i class="layui-icon">&#xe615;</i>
                    已处理申请列表
                </div>
            </div>
        </div>
    </div>
    <div class="layui-col-md11" style="margin-left: 19px">
        <table id="demo" lay-filter="test"></table>
    </div>

<input name="id" type="hidden"/>
</body>
<script>
    var form;
    var $;
    var table;
    var layer;
    var upload;
    var laydate;
    var result = 3;
    layui.use(['laydate','form','jquery','table','layer','upload'],function() {
        form = layui.form;
        $ = layui.jquery;
        table = layui.table;
        layer = layui.layer;
        upload = layui.upload;
        laydate = layui.laydate;

        laydate.render({
            elem: '#test1', //指定元素
            type:'datetime',
        });
    });

    $('.btnLeft > button').click(function(){
        $(this).css("background-color","#009688");
        day = $(this).index()+2;
        //2、其余兄弟去除背景颜色
        $(this).siblings('button').css("background-color","#FFFFFF");
    });

    function refresh() {
        $('#myFrom')[0].reset();
        start();
    }
    start();
    //渲染
    function start() {
        $.ajax({
            url:'/Creator/queryApplyRecord',
            dataType:'json',
            data:{"result":result},
            success:function (data) {
                data = data.data;
                startTab(data);
            }
        });
    }

    function startTab(data) {
        table.render({
            elem:'#demo',
            page:true,
            data:data,
            cols:[[
                {checkbox:true},//复选框靠左
                {title:'序号',width:60,type:'numbers'},
                {field:"nickname",title:"用户姓名",align:'center'},
                {field:"account",title:"用户账户",align:'center'},
                {field:"roleName",title:"申请职位",align:'center'},
                {field:"phone",title:"电话",align:'center'},
                {field:"applyDate",title:"申请时间",align:'center'},
                {field:"email",title:"邮箱",align:'center'},
                {title:"操作",align:'center',templet:function (data) {
                        return "<a class='fontColor' href='javascript:see("+data.id+");'>查看</a>";
                    }},
            ]]
        });
    }

    //搜索
    function selProduct() {
        var applyDate = $('input[name = applyDate]').val();
        var account = $('input[name = account]').val();
        var nickname = $('input[name = nickname]').val();
        $.ajax({
            url:'/Creator/queryApplyRecord',
            dataType:'json',
            data:{"account":account,"nickname":nickname,"applyDate":applyDate},
            success:function (data) {
                data = data.data;
                startTab(data);
            }
        });
    }

    $('#btn > button').on('click',function () {
        var target = $(event.target);
        if(target.text().indexOf("已通过") !== -1){
            result = 3;
        }else{
            result = 4;
        }
        start();
    });
    //查看
    function see(id) {
        $('input[name = id]').val(id);
        layer.open({
            type:2,
            title:'用户详情',
            content:'/usermodule/creator-certification/creator-application-view.html',
            area:['1000px','450px'],
        });
    }

    //高级检索
    function accurate() {
        layer.open({
            type:2,
            title:'高级检索',
            content:'/usermodule/creator-certification/creator-search.html',
            area:['490px','500px']
        });
    }

    function backOff() {
        var arr = localStorage.getItem("numArr");
        var numArr = arr.split(",");
        numArr.pop();
        window.parent.layui.element.tabChange('tab',numArr[numArr.length - 1]);
        localStorage.setItem("numArr",numArr);
    }

    //刷新
    function refresh() {
        window.location.reload();
    }
</script>
</html>